<template>
  <div class="container intro">
      <Header />
      <div class="main">
          <dl v-for="(item,index) in question" :key="index">
              <dt>{{item.title}}</dt>
              <dd>
                  <p v-for="(i,ind) in item.content" :key="ind+'p'">{{i}}</p>
              </dd>
          </dl>
      </div>
  </div>
</template>

<script>
import Header from '../../components/Header.vue'
export default {
    components:{
        Header
    },
    computed:{
        intro(){
            return this.$t("question.intro")
        },
        equity(){
            return this.$t("question.equity")
        },
        autofight(){
            return this.$t("question.autofight")
        },
        question(){
            let hash = location.hash;
            if(hash.indexOf('question=intro')!==-1){
                return this.intro
            }else if(hash.indexOf('question=equity')!==-1){
                return this.equity
            }else{
                return this.autofight
            }
        }
    }
}
</script>

<style lang="scss" scoped>
.intro{
    .main{
        padding: .05rem .16rem .05rem;
    }
    dl{
        dt{
            font-size: .16rem;
            font-weight: bold;
            margin: .15rem 0;
        }
        dd{
            font-size: .13rem;
            line-height: .2rem;
            p{
                margin: .16rem 0;
                word-wrap: break-word;
            }
        }
    }
}
</style>